<!--  -->
<template>
    <div>
        <table v-if="cartList.length">
            <tr>
                <th>
                    id
                </th>
                <th>
                    名称
                </th>
                <th>
                    价格
                </th>
                <th>
                    数量
                </th>
                <th>
                    总价
                </th>
                <th>
                    Actions
                </th>
            </tr>
            <tr v-for="(cart, index) in cartList" :key="index">
                <th>
                    {{cart.id}}
                </th>
                <th>
                    {{cart.title}}
                </th>
                <th>
                    {{cart.price}}
                </th>
                <th>
                    {{cart.inventory}}
                </th>
                <th>
                    {{cart.price * cart.inventory}}
                </th>
                <th>
                    actions
                </th>
            </tr>
        </table>
    </div>
</template>

<script>
import { mapState } from 'vuex'
export default {
    data () {
        return {
        };
    },

    components: {},

    computed: mapState({
        cartList: state => state.myCart.cartList
    }),
    mounted(){},

    methods: {}
}

</script>
<style lang='less' scoped>
table{
    width: 100%;
    th{
        height: 50px;
    }
}
</style>